<!doctype html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,initial-scale=1.0,width=device-width" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no" />
    <link rel="stylesheet" type="text/css" href="../css/index.css" />
    <title>群团文体互动平台</title>
    <!-- Link Swiper's CSS -->
    <link rel="stylesheet" href="../framework/swiper.min.css">
</head>
<body>
    <div class="swiper" id="banner"><!-- 
        <div class="swiper-container">
            <div class="swiper-wrapper" id="picList">
                <div class="swiper-slide"></div>
                <div class="swiper-slide"></div>
                <div class="swiper-slide"></div>
                <div class="swiper-slide"></div>
                <div class="swiper-slide"></div>
            </div>
            <div class="swiper-pagination"></div>
        </div> -->
    </div>
    <!-- banner模板 begin -->
    <script type="text/html" id="banner-template">
        <div class="swiper-container">
            <div class="swiper-wrapper">
				{{each list}}
                <div onclick="fnJump({{$value.id}}, '{{$value.type}}')" style="background-image: url({{$value.picture}})" class="swiper-slide"></div>
				{{/each}}
            </div>
            <div class="swiper-pagination"></div>
        </div>
    </script>
    <!-- banner模板 end -->

    <div class="box">
        <div class="item" onclick="fnJumpActList()">
            <div class="photo act"></div>
            <div class="dis">活动</div>
        </div>
        <div class="item" onclick="fnJumpVoteList()">
            <div class="photo vote"></div>
            <div class="dis">投票</div>
        </div>
        <div class="item" onclick="fnJumpQuestionnaireList()">
            <div class="photo questionnaire"></div>
            <div class="dis">问卷</div>
        </div>
        <div class="item">
            <div class="photo notice" onclick="fnJumpNoList()"></div>
            <div class="dis">公告</div>
        </div>
        <div class="item">
            <div class="photo declare" onclick="fnJumpDeclare()"></div>
            <div class="dis">申报</div>
        </div>
    </div>
    <div class="new listActive hide">
        <div class="title" onclick="fnJumpActList()">
            <p class="til">最新活动</p>
            <span class="more" >更多</span>
        </div>
        <div class="content" id="listActive">
            <!-- <div class="item-act">
                <div class="act-photo"></div>
                <div class="act-message">
                    <div class="act-title">
                        <div class="name">航空旅程5折抢兑</div>
                        <span class="time">2017年8月1日</span>
                    </div>
                    <div class="act-mess">
                        本活动仅限收到我行邀请短信的主卡持卡人参加活动，活动期间不能随意更换卡种，不能使用不能使用不能使用不能使用不能使用
                    </div>
                </div>
            </div>
            <div class="item-act">
                <div class="act-photo"></div>
                <div class="act-message">
                    <div class="act-title">
                        <div class="name">航空旅程5折抢兑</div>
                        <span class="time">2017年8月1日</span>
                    </div>
                    <div class="act-mess">
                        本活动仅限收到我行邀请短信的主卡持卡人参加活动，活动期间不能随意更换卡种，不能使用不能使用不能使用不能使用不能使用
                    </div>
                </div>
            </div> -->
        </div>  
    </div>
    <!-- 活动列表模板 begin -->
    <script type="text/html" id="listActive-template">
        {{each}}
            <div class="item-act"  onclick="fnActDetails({{$value.id}})">
                {{if $value.picture}}
                    <div class="act-photo" style="background-image: url({{$value.picture}});"></div>
                {{/if}}
                <div class="act-message">
                    <div class="act-title">
                        <div class="name">
                            <p class="blod">{{$value.title}}</p>
                        </div>
                        <span class="time">{{$value.time_start.split(' ')[0]}}</span>
                    </div>
                    <div class="act-mess">
                        {{#$value.brief}}
                    </div>
                </div>
            </div>
        {{/each}}
    </script>
    <!-- 活动列表模板 end -->

    <div class="new voteList hide">
        <div class="title"  onclick="fnJumpVoteList()">
            <p class="til">正在投票</p>
            <span class="more">更多</span>
        </div>
        <div class="content" id="voteList">
            <!-- <div class="con">
                <div class="item-vote">
                    <div class="act-photo"></div>
                    <div class="act-message">
                        <div class="act-title">
                            <div class="name">航空旅程5折抢兑</div>
                            <span class="time">2017年8月1日</span>
                        </div>
                        <div class="act-mess">
                            本活动仅限收到我行邀请短信的主卡持卡人参加活动，活动期间不能随意更换卡种，不能使用不能使用不能使用不能使用不能使用
                        </div>
                    </div>
                </div>
                <div class="vote-box">
                    <div class="vote-item left">31245参与投票</div>
                    <div class="vote-item center">784人围观</div>
                    <div class="vote-item right">人气王张三</div>
                </div>
            </div> -->
        </div>
        <!-- 投票列表模板 begin -->
        <script type="text/html" id="voteList-template">
            {{each}}
                <div class="con" onclick="fnVoteDetail({{$value.id}})">
                    <div class="item-vote">
                        {{if $value.picture}}
                            <div class="act-photo" style="background-image: url({{$value.picture}});"></div>
                        {{/if}}
                        <div class="act-message">
                            <div class="act-title">
                                <div class="name">
                                    <p class="blod">{{$value.title}}</p>
                                </div>
                                <span class="time">{{$value.time_start.split(' ')[0]}}</span>
                            </div>
                            <div class="act-mess">
                                {{#$value.brief}}
                            </div>
                        </div>
                    </div>
                    <div class="vote-box">
                        <div class="vote-item left">{{$value.quantity}}参与投票</div>
                        <div class="vote-item center">{{$value.browse}}人围观</div>
                        <div class="vote-item right">人气王{{$value.popular}}</div>
                    </div>
                </div>
            {{/each}}
        </script>
        <!-- 投票列表模板 end -->  
    </div>

    <div class="new questionnaire hide">
        <div class="title" onclick="fnJumpQuestionnaireList()">
            <p class="til">问卷调查</p>
            <span class="more">更多</span>
        </div>
        <div class="content" id="listQuestionnaire">
            <!-- <div class="con">
                <div class="questionnaire-vote">
                    <div class="act-photo questionnaire-photo"></div>
                    <div class="act-message">
                        <div class="act-title bottom-height">
                            <div class="name">航空旅程5折抢兑</div>
                        </div>
                        <div class="act-mess">
                            本活动仅限收到我行邀请短信的主卡持卡人参加活动，活动期间不能随意更换卡种，不能使用不能使用不能使用不能使用不能使用
                        </div>
                        <div class="questionnaire-message">
                            <div class="ques">
                                <span class="eye">52.3万</span>
                                <span class="heart">963</span>
                            </div>
                            <div class="questionnaire-time">2018年8月1日</div>
                        </div>
                    </div>
                </div>
            </div> -->
        </div>
        <!-- 问卷调查列表模板 begin -->
        <script type="text/html" id="listQuestionnaire-template">
            {{each}}
                <div class="con"  onclick="fnQuestionnaireDetail({{$value.id}})">
                    <div class="questionnaire-vote">
                        {{if $value.picture}}
                        <div class="act-photo questionnaire-photo" style="background-image: url({{$value.picture}});"></div>
                        {{/if}}
                        <div class="act-message">
                            <div class="act-title bottom-height">
                                <div class="name blod">{{$value.title}}</div>
                            </div>
                            <div class="act-mess">
                                {{#$value.brief}}
                            </div>
                            <div class="questionnaire-message">
                                <div class="ques">
                                    <span class="eye">{{$value.browse}}</span>
                                    <span class="heart">{{$value.quantity}}</span>
                                </div>
                                <div class="questionnaire-time">{{$value.time_create.split(' ')[0]}}</div>
                            </div>
                        </div>
                    </div>
                </div>
            {{/each}}
        </script>
        <!-- 问卷调查列表模板 end -->
    </div>


    <div class="new listNotice hide">
        <div class="title"  onclick="fnJumpNoList()">
            <p class="til">最新公告</p>
            <span class="more">更多</span>
        </div>
        <div class="content" id="listNotice">
            <!-- <div class="con">
                <div class="questionnaire-vote">
                    <div class="act-photo questionnaire-photo"></div>
                    <div class="act-message">
                        <div class="act-title bottom-height">
                            <div class="name">航空旅程5折抢兑</div>
                        </div>
                        <div class="act-mess">
                            本活动仅限收到我行邀请短信的主卡持卡人参加活动，活动期间不能随意更换卡种，不能使用不能使用不能使用不能使用不能使用
                        </div>
                        <div class="questionnaire-message">
                            <div class="ques">
                                <span class="eye">52.3万</span>
                            </div>
                            <div class="questionnaire-time">2018年8月1日 12:14</div>
                        </div> 
                    </div>
                </div>
            </div>
            <div class="con">
                <div class="questionnaire-vote">
                    <div class="act-photo questionnaire-photo"></div>
                    <div class="act-message">
                        <div class="act-title bottom-height">
                            <div class="name">航空旅程5折抢兑</div>
                        </div>
                        <div class="act-mess">
                            本活动仅限收到我行邀请短信的主卡持卡人参加活动，活动期间不能随意更换卡种，不能使用不能使用不能使用不能使用不能使用
                        </div>
                        <div class="questionnaire-message">
                            <div class="ques">
                                <span class="eye">52.3万</span>
                            </div>
                            <div class="questionnaire-time">2018年8月1日 12:14</div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="con">
                <div class="questionnaire-vote">
                    <div class="act-message">
                        <div class="act-title bottom-height">
                            <div class="name">航空旅程5折抢兑</div>
                        </div>
                        <div class="act-mess">
                            本活动仅限收到我行邀请短信的主卡持卡人参加活动，活动期间不能随意更换卡种，不能使用不能使用不能使用不能使用不能使用
                        </div>
                        <div class="questionnaire-message">
                            <div class="ques">
                                <span class="eye">52.3万</span>
                            </div>
                            <div class="questionnaire-time">2018年8月1日 12:14</div>
                        </div>
                    </div>
                </div>
            </div>  -->  
        </div> 
        <!-- 公告列表模板 begin -->
        <script type="text/html" id="listNotice-template">
            {{each}}
                <div class="con"  onclick="fnNoDetails({{$value.id}})">
                    <div class="questionnaire-vote">
                        {{if $value.picture}}
                        <div class="act-photo questionnaire-photo" style="background-image: url({{$value.picture}});"></div>
                        {{/if}}
                        <div class="act-message">
                            <div class="act-title bottom-height">
                                <div class="name blod">{{$value.title}}</div>
                            </div>
                            <div class="act-mess">
                                {{#$value.brief}}
                            </div>
                            <div class="questionnaire-message">
                                <div class="ques">
                                    <span class="eye">{{$value.browse}}</span>
                                </div>
                                <div class="questionnaire-time">{{$value.time_create.split(' ')[0]}}</div>
                            </div> 
                        </div>
                    </div>
                </div>
            {{/each}}
        </script>
        <!-- 公告列表模板 end --> 
    </div>
</body>
<script type="text/javascript" src="../framework/template-web.js"></script>
<script type="text/javascript" src="../framework/swiper.min.js"></script>
<script type="text/javascript" src="../script/jquery-2.0.3.min.js"></script>
<script type="text/javascript" src="../script/base.js"></script>
<script type="text/javascript">
    fnList();
    fnBanner();

    function fnBanner(){
        //获取banner
        fnAjax({
            url: "Public/getBanner"
        }, function(ret){
			console.log(arguments);
            if( !ret.status ){
				fnValue('#banner',template('banner-template', ret.data));
				var swiper = new Swiper('.swiper-container', {
					pagination: '.swiper-pagination',
					loop: true,
					autoplay: 4000,
					autoplayDisableOnInteraction: false
				});
            }else{
                
            }
        });
    }

    //跳转活动列表
    function fnJumpActList(){
        fnOpen("huodongliebiao.html");
    }

    //跳转活动详情
    function fnActDetails( _id ){
        fnOpen("huodongxiangqing.html",{
            id:_id
        });
    }

    //跳转公告列表
    function fnJumpNoList(){
        fnOpen("gonggaoliebiao.html");
    }

    //跳转公告详情
    function fnNoDetails( _id ){
        fnOpen("gonggaoxiangqing.html",{
            id:_id
        });
    }

    //跳转申报列表
    function fnJumpDeclare(){
        fnOpen("shenbaoliebiao.html");
    }

    //跳转公告详情
    function fnDeclareDetail( _id ){
        fnOpen("shenbaoxiangqing.html",{
            id:_id
        });
    }


    //跳转投票列表
    function fnJumpVoteList(){
        fnOpen("toupiaoliebiao.html");
    }

    //跳转投票详情
    function fnVoteDetail( _id ){
        fnOpen("toupiaoxiangqing.html",{
            id:_id
        });
    }

    //跳转投票列表
    function fnJumpQuestionnaireList(){
        fnOpen("wenjuan.html");
    }

    //跳转问卷详情
    function fnQuestionnaireDetail( _id ){
        fnOpen("wenjuanxiangqing.html",{
            id:_id
        });
    }

    //首页列表
    function fnList(){
        //活动
        fnAjax({
            url: "Active/listActive",
            data: {
                limit:page.limit,
                pageSize:3
            }
        }, function(ret){
            if( !ret.status ){
                if(ret.data.list.length){
                    $('.listActive').removeClass('hide');
                    fnValue('#listActive',template('listActive-template',ret.data.list));
                }
            }else{
                
            }
        });
        
        //投票
        fnAjax({
            url: "Vote/voteList",
            data: {
                limit:page.limit,
                pageSize:3
            }
        }, function(ret){
            if( !ret.status ){
                if(ret.data.list.length){
                    $('.voteList').removeClass('hide');
                    fnValue('#voteList',template('voteList-template',ret.data.list));
                }
            }else{
                
            }
        });

        //问卷
        fnAjax({
            url: "Questionnaire/listQuestionnaire",
            data: {
                limit:page.limit,
                pageSize:3
            }
        }, function(ret){
            if( !ret.status ){
                if(ret.data.list.length){
                    $('.questionnaire').removeClass('hide');
                    fnValue('#listQuestionnaire',template('listQuestionnaire-template',ret.data.list));
                }
            }else{
                
            }
        });

        //公告
        fnAjax({
            url: "Notice/listNotice",
            data: {
                limit:page.limit,
                pageSize:3
            }
        }, function(ret){
            if( !ret.status ){
                if(ret.data.list.length){
                    $('.listNotice').removeClass('hide');
                    fnValue('#listNotice',template('listNotice-template',ret.data.list));
                }
            }else{
                
            }
        });
    }
	
	function fnJump(_id, _type){
		switch(Number(_type)){
			case 1:
				fnActDetails(_id);
			break;
			case 2:
				fnVoteDetail(_id);
			break;
			case 3:
				fnNoDetails(_id);
			break;
			case 4:
				fnDeclareDetail(_id);
			break;
		}
	}
</script>
</html>
